<template>
  <div class="consult-list">
    <van-list
      v-model:loading="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <consult-order-item
        v-for="item in list"
        :key="item.id"
        :consult-order="item"
      />
    </van-list>
  </div>
</template>

<script lang="ts" setup>
import { provide, ref } from 'vue'
import request from '@/utils/request'
import { ApiRes } from '@/types/data'
import {
  ConsultOrderList,
  ConsultOrderItem as OrderItem
} from '@/types/consult'
import ConsultOrderItem from './consult-order-item.vue'
const props = defineProps<{ type: string }>()
const list = ref([] as OrderItem[])
const loading = ref(true)
const current = ref(0)
const pageSize = ref(10)
const finished = ref(false)
// 删除问诊订单项
const deleteOrderItem = (id: string) => {
  list.value = list.value.filter(item => item.id !== id)
}
provide('deleteOrderItem', deleteOrderItem)
const onLoad = async () => {
  current.value++
  const res = await request.get<ApiRes<ConsultOrderList>>(
    'patient/consult/order/list',
    {
      params: {
        current: current.value,
        pageSize: pageSize.value,
        type: props.type
      }
    }
  )

  if (res.data.code === 10000) {
    // 停止
    loading.value = false
    list.value = [...list.value, ...res.data.data.rows]

    if (list.value.length >= res.data.data.total) {
      finished.value = true
    }
  }
}
</script>

<style lang="scss" scoped>
.consult-list {
  padding: 10px 15px;
}
</style>
